/* eslint-disable no-unused-vars */
/* eslint-disable no-undef */
async function banner() {
    let res = await ajaxFn({
        baseUrl:
            'https://service-dmsf9bxc-1251395798.gz.apigw.tencentcs.com/release',
        url: '/api/web/carouselGroup/get',
        method: 'GET',
        data: {
            carouselGroupId: 18,
            projectId: '22',
        },
        headers: {
            'Content-type': 'application/json',
        },
    });
    //console.log(res.data.w_carousels);
    let arr = res.data.w_carousels;
    let slider = document.querySelector('.slider');
    let dotsContainer = document.querySelector('.slider > .dots');
    let currentSlide = 0;
    arr.forEach(function (item, index) {
        if (index == 0) {
            dotsContainer.innerHTML += '<span class="dot active"></span>';
        } else {
            dotsContainer.innerHTML += '<span class="dot"></span>';
        }
    }),
        arr.forEach(function (item, index) {
            // console.log(item.url);
            slider.innerHTML += `<div class="img slide"><img src="${item.url}"></div>`;
        });
    let slides = Array.from(document.querySelectorAll('.slide'));

    let dots = document.querySelectorAll('.dot');
    dots.forEach(function (item, index) {
        item.addEventListener('click', () => {
            currentSlide = index;
            showSlide(currentSlide);
            dots.forEach((item) => {
                item.classList.remove('active');
            });
            item.classList.add('active');
        });
    });

    function showSlide(n) {
        // 隐藏所有幻灯片
        slides.forEach((slide) =>
            slide.classList.remove('active', 'prev', 'next')
        );

        // 显示当前幻灯片和指示点
        slides[n].classList.add('active');
        dotsContainer.children[n].classList.add('active');

        // 显示前一个和下一个幻灯片
        if (n === 0) {
            slides[slides.length - 1].classList.add('prev');
            dotsContainer.children[slides.length - 1].classList.remove(
                'active'
            );
            slides[n + 1].classList.add('next');
            dotsContainer.children[n + 1].classList.remove('active');
        } else if (n === slides.length - 1) {
            slides[n - 1].classList.add('prev');
            dotsContainer.children[n - 1].classList.remove('active');
            slides[0].classList.add('next');
            dotsContainer.children[0].classList.remove('active');
        } else {
            slides[n - 1].classList.add('prev');
            dotsContainer.children[n - 1].classList.remove('active');
            slides[n + 1].classList.add('next');
            dotsContainer.children[n + 1].classList.remove('active');
        }
    }

    function nextSlide() {
        currentSlide++;
        if (currentSlide >= slides.length) {
            currentSlide = 0;
            dotsContainer.children[0].classList.add('active');
        }
        dots.forEach(function (item, index) {
            item.classList.remove('active');
        });
        dots[currentSlide].classList.add('active');
        showSlide(currentSlide);
    }

    setInterval(nextSlide, 5000); // 每5秒切换到下一张幻灯片

    showSlide(currentSlide); // 显示第一张幻灯片和指示点
}
banner();
